<template>
  <div class="settings-phone">
    <settings-detail-template
      @save="saveSettings" 
      @click="handleHideLayer"
      :name="name">
      <div class="form-wrapper">
        <form class="form box-shadow">
          <input-item 
            :title="'微信号'" 
            :placeholder="'请输入微信号'"
            @input="updateValue"
            >
          </input-item>
        </form>
      </div>
    </settings-detail-template>
  </div>
</template>
<script>
import SettingsDetailTemplate from './settings-detail-template'
import InputItem from '@/pages/login/components/input-item'
export default {
  components: {
    SettingsDetailTemplate,
    InputItem
  },
  data() {
    return {
      name: '微信号',
      wechatId: '',
      errorMsg: '',
      saved : false
    }
  },
  methods: {
    updateValue(val) {
      this.wechatId = val
    },
    saveSettings() {
      if (this.wechatId == '') {
        this.errorMsg = '微信号不能为空'
      }
      else {
        this.saved = true
        this.$emit('pop',"保存成功")
      }
    },
    handleHideLayer() {
      if(this.saved != false){
        this.$emit('click')
      }
      else{
        this.$emit('pop',"未修改")
        this.$emit('click')
      }
    }
  }
}
</script>
<style lang="stylus" scoped>
@import '~@/assets/styles/variables.styl'
  .settings-phone 
    .form-wrapper 
      box-sizing border-box 
      padding 10px
    .form 
      border-radius 3px
      background #fff
      border 1px solid $color-divide-line
    .get-code 
      margin-left 10px 
      color $color-theme-dark
</style>